window.onload = function() {
	var share, fav, app, coin, zan, battery;
	share = document.getElementsByClassName("share")[0];
	fav = document.getElementsByClassName("fav")[0];
	app = document.getElementsByClassName("app")[0];
	coin = document.getElementsByClassName("coin")[0];
	zan = document.getElementsByClassName("zan")[0];
	battery = document.getElementsByClassName("elecrank-btn")[0];
	bindAnimation(share, {
		step: 80,
		start: 0,
		end: -1280
	});
	bindAnimation(fav, {
		step: 80,
		start: 0,
		end: -1040,
		continue: true
	});
	bindAnimation(app, {
		step: 80,
		start: 0,
		end: -1200,
		keep: true
	});
	bindAnimation(coin, {
		step: 80,
		start: 0,
		end: -560,
		'continue': true
	});
	bindAnimation(zan, {
		step: 80,
		start: 0,
		end: -560,
		'continue': true
	});
	var batteryConfig = {
		step: 80,
		start: 0,
		end: -320,
		'continue': true,
		timer: null
	}
	battery.onmouseover = function() {
		config = batteryConfig;
		var icon = this.getElementsByClassName("elecrank-bg")[0];
		config.step = -config.step;
		animation(icon, config);
	}
	battery.onmouseout = function() {
		config = batteryConfig;
		var icon = this.getElementsByClassName("elecrank-bg")[0];
		config.step = -config.step;
		animation(icon, config);
	}
}

function bindAnimation(container, config) {
	var icon = container.getElementsByClassName("icon")[0];
	config.timer = null;
	container.onmouseover = function() {
		config.step = -config.step;
		animation(icon, config);
	}
	container.onmouseout = function() {
		config.step = -config.step;
		animation(icon, config);
	}
}

function animation(icon, config) {
	clearInterval(config.timer);
	config.timer = setInterval(function() {
		var x = icon.style.backgroundPositionX;
		x = parseInt(x) + config.step;
		if(x >= config.end && x <= config.start) {
			if((!!config.keep) && x === config.end) {
				icon.style.backgroundPositionX = (x - config.step * 5) + "px";
			} else {
				icon.style.backgroundPositionX = x + "px";
			}

		} else {
			if(!!config.continue && x === config.end + config.step) {
				icon.style.backgroundPositionX = config.start;
			} else {
				clearInterval(config.timer);
			}
		}
	}, 100)
}